<template>
	<view class="container">
		<view class="tui-page__hd">
			<view class="tui-page__title">Chart</view>
			<view class="tui-page__desc">图表：css版本，该图表功能尚未完全覆盖常用场景，后续会继续更新完善</view>
		</view>
		<view class="tui-page__bd tui-page__spacing">
			<tui-button type="gray-primary" :size="34" bold width="372rpx" height="84rpx" margin="0 auto"
				@click="href(1)">柱状图</tui-button>
			<tui-button type="gray-primary" :size="34" bold width="372rpx" height="84rpx" margin="40rpx auto"
				@click="href(2)">柱状图-横向</tui-button>
			<tui-button type="gray-primary" :size="34" bold width="372rpx" height="84rpx" margin="40rpx auto"
				@click="href(3)">折线图</tui-button>
			<tui-button type="gray-primary" :size="34" bold width="372rpx" height="84rpx" margin="40rpx auto"
				@click="href(4)">饼状图</tui-button>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {

			}
		},
		methods: {
			href(type) {
				let url = '/pages/component/charts-column/charts-column'
				if (type == 2) {
					url = '/pages/component/charts-bar/charts-bar'
				} else if (type == 3) {
					url = '/pages/component/charts-line/charts-line'
				} else if (type == 4) {
					url = '/pages/component/charts-pie/charts-pie'
				}
				this.tui.href(url)
			}
		}
	}
</script>

<style>

</style>
